<template>
  <div>
    <h1>Home</h1>
    <div>
      <!-- params传参 -->
      <router-link to="/home/news">news</router-link>
      <!-- -->
      <!-- <router-link to="/home/music/1">华语music</router-link>
      <router-link to="/home/music/2">粤语music</router-link>
      <router-link to="/home/music/3">英语music</router-link> -->

      <router-link
        :to="{
          name: 'music',
          params: {
            id: '1',
            title: '张三',
          },
        }"
        >华语music</router-link
      >
      <router-link
        :to="{
          name: 'music',
          params: {
            id: '2',
            title: '李四',
          },
        }"
        >粤语music</router-link
      >

      <router-link :to="{
        name:'games',
        query:{
          tit:'暴力摩托',
          version:'2007'
        }

      }">游戏1</router-link>

      <router-link :to="{
        name:'games',
        query:{
          tit:'穿越火线',
          version:'2009'
        }
      }">游戏2</router-link>

      <router-link to="/home/games?tit=qq飞车&version=2001">游戏3</router-link>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "Home",
  mounted() {
    // console.log(this);
  },
};
</script>

<style>
</style>